<template>
    <el-row>
    <el-col :span="24" class="padding"><input
      class="search"
      placeholder="搜索"
      icon="search"
      v-model="input2"
      :on-icon-click="handleIconClick">
    </input></el-col>
  </el-row>
</template>
<script>
  import ElRow from "element-ui/packages/row/src/row";
  import ElCol from "element-ui/packages/col/src/col";

  export default {
    components: {
      ElCol,
      ElRow},
    data() {
      return {
        input2: ''
      }
    },
    methods: {
      handleIconClick(ev) {
        console.log(ev);
      }
    }
  }
</script>
<style lang="stylus" rel="stylesheet/stylus">
  @import "~common/stylus/variable"
  h3,p{
    margin: 0;
    line-height: 1.5;
  }
  .padding{
    padding:20px;
  }
 input{
   height: 34px;
   width: 90%;
   text-align: center;
   border:1px solid #ccc;
   border-radius:20px;
 }
 .el-row{
   background-color:$color-background-search;
 }
 .banner{
   background-color: #ccc;
   height: 200px;
 }
  .section{
    padding:10px;
    margin-bottom: 10px;
  }
  .el-col-8{
    display: inline-flex;
    text-align: left;
    margin-left:10%;
    vertical-align: middle;
  }
  .el-col-12{
    display: inline-flex;
    width: 48%;
  }
  .hot{
    background-color: #fff4c2;
  }
</style>

